<!DOCTYPE html>
<html lang="zh" data-bs-theme="dark">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link href="./css/bootstrap.min.css" rel="stylesheet" />
    <title>专注一点APP</title>
  </head>
  <body>
    <header
      class="container d-flex flex-wrap justify-content-between py-3 mb-4 row-gap-3"
    >
      <a
        href="/"
        class="d-flex align-items-center mb-3 mb-md-0 me-md-auto link-body-emphasis text-decoration-none"
      >
        <img class="bi me-2" width="35" height="35" src="./imgs/logo.png" />
        <span class="fs-4">专注一点</span>
      </a>

      <ul class="nav">
        <li class="nav-item">
          <a
            href="/wechat.html"
            class="nav-link active text-body-emphasis"
            aria-current="page"
            >公众号</a
          >
        </li>
        <li class="nav-item">
          <a href="/" class="nav-link text-body-emphasis">APP</a>
        </li>
      </ul>
    </header>
    <div class="index-page px-4 pt-5 my-5 text-center">
      <h1 class="display-4 fw-bold text-body-emphasis">
        戒掉手机瘾 & 保持专注力
      </h1>
      <div class="col-lg-6 mx-auto">
        <p class="lead mb-4">
          专注一点APP通过屏蔽其他APP的网络来让您保持专注，您可以安心使用手机学习或工作，而不被其他娱乐类APP打扰
        </p>
        <div class="d-grid gap-2 d-sm-flex justify-content-sm-center mb-5">
          <a
            type="button"
            href="./apps/focusone.apk"
            class="btn btn-primary btn-lg px-4 me-sm-3"
            download
          >
            Android 下载
          </a>
          <button type="button" class="btn btn-outline-secondary btn-lg px-4">
            IOS 敬请期待
          </button>
        </div>
      </div>
      <div class="container px-5">
        <img
          src="./imgs/home_screen.png"
          class="img-fluid rounded-3 mb-4"
          width="460"
          loading="lazy"
        />
      </div>
    </div>
    <footer class="py-4 mt-auto bg-body-tertiary">
      <div class="container-fluid">
        <ul class="nav d-flex justify-content-center">
          <li class="nav-item">
            <a href="/" class="nav-link text-body-secondary">Mission</a>
          </li>
          <li class="nav-item">
            <a href="/" class="nav-link text-body-secondary">Privacy</a>
          </li>
          <li class="nav-item">
            <a href="/" class="nav-link text-body-secondary">Terms of Use</a>
          </li>
          <li class="nav-item">
            <a href="/" class="nav-link text-body-secondary">Imprint</a>
          </li>
          <li class="nav-item">
            <a
              class="nav-link text-body-secondary"
              href="/"
              target="_blank"
              rel="noopener"
            >
              <svg
                xmlns="http://www.w3.org/2000/svg"
                height="1em"
                viewBox="0 0 448 512"
                fill="currentColor"
              >
                <title>Instagram</title>
                <path
                  d="M224.1 141c-63.6 0-114.9 51.3-114.9 114.9s51.3 114.9 114.9 114.9S339 319.5 339 255.9 287.7 141 224.1 141zm0 189.6c-41.1 0-74.7-33.5-74.7-74.7s33.5-74.7 74.7-74.7 74.7 33.5 74.7 74.7-33.6 74.7-74.7 74.7zm146.4-194.3c0 14.9-12 26.8-26.8 26.8-14.9 0-26.8-12-26.8-26.8s12-26.8 26.8-26.8 26.8 12 26.8 26.8zm76.1 27.2c-1.7-35.9-9.9-67.7-36.2-93.9-26.2-26.2-58-34.4-93.9-36.2-37-2.1-147.9-2.1-184.9 0-35.8 1.7-67.6 9.9-93.9 36.1s-34.4 58-36.2 93.9c-2.1 37-2.1 147.9 0 184.9 1.7 35.9 9.9 67.7 36.2 93.9s58 34.4 93.9 36.2c37 2.1 147.9 2.1 184.9 0 35.9-1.7 67.7-9.9 93.9-36.2 26.2-26.2 34.4-58 36.2-93.9 2.1-37 2.1-147.8 0-184.8zM398.8 388c-7.8 19.6-22.9 34.7-42.6 42.6-29.5 11.7-99.5 9-132.1 9s-102.7 2.6-132.1-9c-19.6-7.8-34.7-22.9-42.6-42.6-11.7-29.5-9-99.5-9-132.1s-2.6-102.7 9-132.1c7.8-19.6 22.9-34.7 42.6-42.6 29.5-11.7 99.5-9 132.1-9s102.7-2.6 132.1 9c19.6 7.8 34.7 22.9 42.6 42.6 11.7 29.5 9 99.5 9 132.1s2.7 102.7-9 132.1z"
                ></path>
              </svg>
            </a>
          </li>
        </ul>
      </div>
      <div class="container-fluid">
        <ul class="nav d-flex justify-content-center mt-3 small">
          <li class="nav-item">
            <a lang="en" href="/" class="nav-link text-body-secondary"
              >English</a
            >
          </li>
          <li class="nav-item">
            <a lang="de" href="/" class="nav-link text-body-secondary"
              >Deutsch</a
            >
          </li>
          <li class="nav-item">
            <a lang="es" href="/" class="nav-link text-body-secondary"
              >Español</a
            >
          </li>
        </ul>
      </div>
      <p class="text-center text-secondary py-2 mt-3 mb-0 small">
        Copyright © 2024 专注一点
      </p>
    </footer>
  </body>
</html>
